<template>
    <div class="programModify">
        <el-form 
            ref="ruleForm" 
            label-width="100px"
            :model="ruleForm"
            :rules="rules">
            <el-form-item label="商品名称" prop="name">
                <el-input v-model="ruleForm.name"></el-input>
            </el-form-item>
            <el-upload
                class="upload-demo"
                action="https://www.yyjpai.com/index/operate/uploadsImg"
                :on-success=handleAvatarSuccess
                :file-list="fileList"
                name="file"
                list-type="picture">
                <el-button size="small" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>
            <el-form-item label="日产出上线" prop="prizeUpperLimit">
                <el-input v-model="ruleForm.prizeUpperLimit"></el-input>
            </el-form-item>
            <el-form-item label="最小概率" prop="sectionMin">
                <el-input v-model="ruleForm.sectionMin"></el-input>
            </el-form-item>
            <el-form-item label="最大概率" prop="sectionMax">
                <el-input v-model="ruleForm.sectionMax"></el-input>
            </el-form-item>
            <el-form-item label="数量" prop="number">
                <el-input v-model="ruleForm.number"></el-input>
            </el-form-item>
            <el-form-item label="商品类型" prop="prizetype">
                <el-select v-model="ruleForm.prizetype" placeholder="请选择商品类型">
                    <el-option label='请选择' value='' ></el-option>
                    <el-option label='红包' value='红包' ></el-option>
                    <el-option label='实物' value='实物' ></el-option>
                    <el-option label='金币' value='金币' ></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="排序" prop="sort">
                <el-input v-model="ruleForm.sort"></el-input>
            </el-form-item>
            
        </el-form>
       <el-button @click="submitForm('ruleForm')" size="medium" class="addSubimit">提交</el-button>
    </div>
</template>
<script>
import { AddData } from '@/assets/js'
export default {
    data(){
        const sectionMin = (rule,value,callback)=>{
            
            
            if(value==''){
                callback(new Error('请输入最小概率'))
            }

            let val = Number(value)
            if(val<0){
                callback(new Error('最小概率不能小于0'))
            }
            else if(val>=10000){
                callback(new Error('最小概率不能小于10000'))
            }
            else{
                callback()
            }
        }
        const sectionMax = (rule,value,callback)=>{
            if(value==''){
                callback(new Error('请输入最大概率'))
            }
            let val = Number(value)
            if(val<0){
                callback(new Error('最大概率不能小于0'))
            }
            else if(val>10000){
                callback(new Error('最大概率不能大于于10000'))
            }
            else{
                callback()
            }
        }
        return {
            options:[],//下拉
            urlSize:1,//上传图片数量
            fileList: [],//图片数组
            ruleForm:{//下拉选中
                logo:'',
                name:'',
                prizeUpperLimit:'',
                sectionMin:'',
                sectionMax:'',
                number:'',
                prizetype:'',
                sort:''
            },
            rules:{//验证
                name:[
                    { required: true, message: '请输入商品名称', trigger: 'blur' }
                ],
                prizeUpperLimit:[
                    { required: true, message: '请输入每日产出上限', trigger: 'blur' }
                ],
                sectionMin:[
                    { validator:sectionMin, trigger: 'blur' }
                ],
                sectionMax:[
                    { validator:sectionMax, trigger: 'blur' }
                ],
                number:[
                    { required: true, message: '请输入商品数量', trigger: 'blur' }
                ],
                prizetype:[
                    { required: true, message: '请选择商品类型', trigger: 'blur' }
                ],
                sort:[
                    { required: true, message: '请输入排序', trigger: 'blur' }
                ],
            }
        }
    },
    methods:{
        handleAvatarSuccess(res, file) {//上传成功之后
            this.ruleForm.logo = file.response.data.logo
        },
        submitForm:function(e){//点击提交
            var data = {
                logo:this.ruleForm.logo ? this.ruleForm.logo : '',
                name: this.ruleForm.name?this.ruleForm.name:'',
                prizeUpperLimit: this.ruleForm.prizeUpperLimit?this.ruleForm.prizeUpperLimit:'',
                sectionMin: this.ruleForm.sectionMin?this.ruleForm.sectionMin:'',
                sectionMax: this.ruleForm.sectionMax?this.ruleForm.sectionMax:'',
                number: this.ruleForm.number?this.ruleForm.number:'',
                prizetype: this.ruleForm.prizetype?this.ruleForm.prizetype:'',
                sort: this.ruleForm.sort?this.ruleForm.sort:1
            }
            // if(this.$parent.tableData.length>=5){
            //     this.$notify.error({
            //         title: '最多添加5条哦！',
            //     });
            //     t.$layer.closeAll()//关闭弹层
            //     return false;
            // }
            if(this.ruleForm.logo==''){
                this.$notify.error({
                    title: '必须选择图片哦！',
                });
            }
            else{
                AddData(this,e,data,'lottery_draw/addPrize')
            }
        }
    }
}
</script>